<template>
<!-- 还款单 -->
<section class="content-box">
  <div v-show="isshowList">
    <!--工具条-->
    <el-col :span="24" class="toolbar">
      <el-form class="title cover">
        <h2>还款单</h2>
        <el-form-item>
          <el-button size="small" class="el-icon-plus" @click="handleAdd">&nbsp;新建&nbsp;</el-button>
        </el-form-item>
        <el-form-item>
          <el-button size="small" @click="search" class="el-icon-search">&nbsp;查询</el-button>
        </el-form-item>
      </el-form>
    </el-col>
    <!-- <el-col :span="24" class="SuppC-toolbar">
      <el-form class="title">
        <div>
          <h2>还款单</h2>
          <img @click="handleAdd" class="SuppC-common-icon" src="../../../static/content/images/Common/common-add.png" alt=""/>
        </div>
        <el-form-item class="cover">
          <div class="list-img" @click="search">
            <img class="SuppC-common-icon" src="../../../static/content/images/Common/common-query.png" alt=""/>
            <span>查询</span>
          </div>
        </el-form-item>
      </el-form>
    </el-col>     -->
    <!-- 列表 -->
    <!-- <el-table class="indexList" v-if="refundList" :data="refundList" highlight-current-row max-height="700" v-loading="loading" element-loading-text="正在加载中">
      <el-table-column label="序号" type="index" width="100" sortable>
      </el-table-column>
      <el-table-column prop="Repay_CreateDate" label="日期" :formatter="formatDate" sortable>
      </el-table-column>
      <el-table-column prop="Repay_DocNO" label="编号" sortable>
      </el-table-column>
      <el-table-column prop="Repay_Title" label="标题" show-overflow-tooltip>
      </el-table-column>
      <el-table-column prop="UserName" label="申请人">
      </el-table-column>
      <el-table-column prop="Repay_TotalRepayMoney" label="总金额" sortable>
      </el-table-column>
      <el-table-column prop="DocStatus" label="状态" sortable>
      </el-table-column>
      <el-table-column label="操作" min-width="150">
        <template slot-scope="scope">
            <el-button-group>
  						<el-button size="small" @click="handleEdit(scope.$index, scope.row)">编辑</el-button> 
  						<el-button v-if="scope.row.DocStatus==='待审核'" size="small" @click="repeal(scope.$index, scope.row)">撤销</el-button>
  						<el-button size="small" @click="checkflowRow(scope.$index, scope.row)">查看流程</el-button>
  						<el-button size="small" @click="handleDel(scope.$index, scope.row)">删除</el-button>
              <el-button size="small" v-if="scope.row.AttachmentCount>0" class="icon iconfont icon-attachment"></el-button>
            </el-button-group>
        </template>
			</el-table-column>
		</el-table> -->
    <el-table class="indexList" v-if="refundList" :data="refundList" highlight-current-row max-height="700" @row-dblclick="handleEdit" @cell-mouse-enter="cellMouseEnterTwoFn" @cell-mouse-leave="cellMouseLeaveFn" v-loading="loading" element-loading-text="正在加载中" style="width: 100%;">
      <el-table-column prop="Repay_CreateDate" label="日期" :formatter="formatDate" sortable>
      </el-table-column>
      <el-table-column prop="Repay_DocNO" label="单号" sortable>
      </el-table-column>
      <el-table-column prop="Repay_TotalRepayMoney" label="金额" sortable>
      </el-table-column>
      <el-table-column prop="Repay_Title" label="业务描述" min-width="150" show-overflow-tooltip>
      </el-table-column>
      <el-table-column prop="DocStatus" label="状态" sortable>
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
            <!-- <el-button-group>
  						<el-button size="small" @click="handleEdit(scope.$index, scope.row)">编辑</el-button> 
  						<el-button v-if="scope.row.DocStatus==='待审核'" size="small" @click="repeal(scope.$index, scope.row)">撤销</el-button>
  						<el-button size="small" @click="checkflowRow(scope.$index, scope.row)">查看流程</el-button>
  						<el-button size="small" @click="handleDel(scope.$index, scope.row)">删除</el-button>
              <el-button size="small" v-if="scope.row.AttachmentCount>0" class="icon iconfont icon-attachment"></el-button>
            </el-button-group> -->
            <div v-if="scope.row.Repay_DocNO==mouse_enter_Borrow_DocNO">
            <!-- <div>  -->
              <div  v-if="scope.row.DocStatus==='待审核'" class="list-img" @click.stop="repeal(scope.$index, scope.row)">
                <!-- 撤销 -->
                <img class="common-icon" src="../../../static/content/images/Common/common-repeal.png" alt=""/>
              </div>
              <div v-if="scope.row.DocStatus!=='新建'" class="list-img" @click.stop="checkflowRow(scope.$index, scope.row)">
                <!-- 查看流程 -->
                <img class="common-icon" src="../../../static/content/images/Common/common-flow.png" alt=""/>
              </div>
              <div v-if="scope.row.DocStatus==='新建'" class="list-img" @click.stop="handleDel(scope.$index, scope.row)">
                <!-- 删除 -->
                <img class="common-icon" src="../../../static/content/images/Common/common-list-dele.png" alt=""/>
              </div>
              <div  v-if="scope.row.AttachmentCount>0" class="list-img">
                <!-- 附件 -->
                <img class="common-icon" src="../../../static/content/images/Common/common-attach.png" alt=""/>
              </div>
            </div>            
        </template>
			</el-table-column>
		</el-table>

    <!--工具条-->
    <el-col :span="24" class="toolbar">
      <el-pagination @current-change="changePage" layout="prev, pager, next" :page-size="rows" :current-page="currentPage" :total="total" style="float:right;">
      </el-pagination>
    </el-col>

		<!--流程图-->
		<el-dialog title="流程执行情况" :visible.sync="checkflowRowVisible" :modal-append-to-body="false" align="center">
			<el-table :data="docView" header-align="center"  v-loading="docViewloading" element-loading-text="拼命刷新中...">
				<el-table-column property="PlanUser" label="操作人"></el-table-column>
				<el-table-column property="StepName" label="步骤名称"></el-table-column>
				<el-table-column property="OpDate" label="时间"></el-table-column>
				<el-table-column property="OpRemark" label="备注"></el-table-column>
			</el-table>
		</el-dialog>
		</div>
		<!-- 新建页面 -->
		<div v-show="isshowAdd">
			<!-- 导航条 -->
			<div class="flex-top">
				<div>
					<i class="el-icon-arrow-left back" @click="addToBack"></i>
					<span style="font-size:20px;vertical-align:middle;margin:0 10px;">
						还款单 </span>
					<!-- <small>
						<span>状态：</span>
						<el-tag type="success">新增</el-tag>
					</small> -->
				</div>
				<!-- 右侧 -->
				<div class="flex">
					<span class="wrapper cover">
            <el-button-group>
              <el-button size="small" @click="openUploadDialog">
                <i class="icon iconfont icon-shangchuan"></i>&nbsp;附件
              </el-button>     
              <el-button size="small" @click="addSave">
                <i class="icon iconfont icon-baocun"></i>&nbsp;保存
              </el-button>
              <el-button size="small" @click="addSubmit">
                <i class="icon iconfont icon-tijiao"></i>&nbsp;提交
              </el-button>
            </el-button-group>
					</span>
				</div>
			</div>
      <div class="flex-content">
        <!-- 中部 -->
        <main class="refund main">
          <div class="main-left">
            <div v-if="DocNo">					
              <h3>单号:</h3>
              <strong>{{DocNo}}</strong>
            </div>
            <div>
              <h3>日期：</h3>
              <div class="flex">
                <el-date-picker type="date" v-model="Repay_DocDate" placeholder="选择日期">
                </el-date-picker>
              </div>
            </div>
            <div>
              <h3>还款金额</h3>
              <div class="comPay-wrapper">
                <strong class="comPay-icon">
                  <i class="icon iconfont icon-yue"></i>
                </strong>
                <div class="comPay-text">
                  <el-input type="text" v-model="Repay_TotalRepayMoney" @keyup.native="onlyNumBasicFn('Repay_TotalRepayMoney')" @blur="doToFixedFn('Repay_TotalRepayMoney')"></el-input>
                </div>
              </div>
            </div>
          </div>
          <div class="main-right">
            <div class="right-form">
              <span>业务描述</span><br><br>
              <el-input
              type="textarea"
              :rows="10"
              placeholder="请输入内容"
              v-model="Repay_Title">
              </el-input>
            </div>
          </div>
        </main>
        <!--底部-->
        <div class="budget-two">
          <div class="padding-size-10">
            <div class="nav">
              <span>
                <i class="icon iconfont icon-iconfontcolor52"></i>核销借款</span>
                <!-- &#x3000;
                合计：<span class="Count">{{Count}}</span>&#12288;       -->
                <!-- <el-button class="add-button" size="small" @click="getOperaAddDiaLog">点击添加</el-button> -->
            </div>
            <el-dialog title="欠款明细" :visible.sync="dialogOperaVisible" @close="cancel" :modal-append-to-body="false" align="center" size="small">
              <!-- 
                  新增 弹窗 借款单信息
                -->
              <el-table :data="operationTemp"  highlight-current-row border max-height="300" class="th-text-center">
                <el-table-column label="借款单" width="120">
                  <template slot-scope="scope">
                  {{ scope.row.Borrow_DocNO }}
                  </template>
                </el-table-column>
                <el-table-column label="总金额" width="120">
                  <template slot-scope="scope">
                  {{ scope.row.Borrow_TotalBorrowMoney==0 ? '' : scope.row.Borrow_TotalBorrowMoney}}
                  </template>
                </el-table-column>
                <el-table-column label="未核销金额" width="120">
                  <template slot-scope="scope">
                  {{ scope.row.Surplus==0 ? '' : scope.row.Surplus}}
                  </template>
                </el-table-column>
                <el-table-column label="本次核销金额" width="150">
                  <template slot-scope="scope">
                    <div class="full-box">
                      <el-input type="text" @keyup.native="onlyNumObjFn(scope,'row','Money')" @blur="doToFixed(scope,'row','Money')" :autofocus="true" v-model="scope.row.Money" placeholder="请输入金额"></el-input>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="事由">
                  <template slot-scope="scope">
                  {{ scope.row.Borrow_Title }}
                  </template>
                </el-table-column>
              </el-table>
              <span slot="footer" class="dialog-footer">
                <el-button @click="cancel">取 消</el-button>
                <el-button type="primary" @click="confirm">确 定</el-button>
              </span>
            </el-dialog>
            <!--克隆 -->
            <el-table v-if="operaPrint" :data="operaPrint" :empty-text="'请点击添加核销借款明细'" @cell-mouse-enter="cellMouseEnterFn" @cell-mouse-leave="cellMouseLeaveFn" @click.native="getOperaAddDiaLog" border style="width: 100%;" highlight-current-row max-height="300" class="th-text-center">
              <el-table-column label="操作" width="80">
                <template slot-scope="scope">
                  <div class="text-align-center" v-if="scope.row.Borrow_DocNO==mouse_enter_Borrow_DocNO">
                    <button size="small" @click.stop="changeMoneyToZero(scope)" class="oper-btn"><img class="common-icon" src="/static/content/images/Common/common-dele.png"/></button>
                  </div>                  
                </template>
              </el-table-column>              
              <el-table-column label="借款单" width="120">
                <template slot-scope="scope">
                {{ scope.row.Borrow_DocNO }}
                </template>
              </el-table-column>
              <el-table-column label="总金额" width="120">
                <template slot-scope="scope">
                  {{ scope.row.Borrow_TotalBorrowMoney==0 ? '' : scope.row.Borrow_TotalBorrowMoney}}
                </template>
              </el-table-column>
              <el-table-column label="未核销金额" width="120">
                <template slot-scope="scope">
                {{ scope.row.Surplus==0 ? '' : scope.row.Surplus}}
                </template>
              </el-table-column>
              <el-table-column label="本次核销金额" width="120">
                <template slot-scope="scope">
                {{ scope.row.Money==0 ? '' : scope.row.Money}}
                </template>
              </el-table-column>
              <el-table-column label="事由">
                <template slot-scope="scope">
                {{ scope.row.Borrow_Title }}
                </template>
              </el-table-column>
            </el-table>
            <div class="clearfloat">
              <div class="total-box">合计：<span class="Count-text">{{Count}}</span></div>
            </div>  
          </div>      
        </div>
      </div>
		</div>
		<!-- 
      编辑/待审核/已审核/已发起/未发起 界面 	
     -->
		<div v-show="isshowEdit">
			<!-- 导航条 -->
			<div class="flex-top">
				<div>
					<i class="el-icon-arrow-left back" @click="editToBack"></i>
					<span style="font-size:20px;vertical-align:middle;margin:0 10px;">
						还款单 </span>
					<small>
						<span>状态：</span>
						<el-tag type="success">{{Type===0?'新增':Type===1?'修改':Type===2?'查看':Type===3?'审核':''}}</el-tag>
					</small>
				</div>
				<!-- 右侧 -->
				<div class="flex">
					<span class="wrapper cover">
            <el-button-group>
              <el-button size="small" @click="openUploadDialog" :disabled="fjBtnDisabled">
                <i class="icon iconfont icon-shangchuan"></i>&nbsp;附件
              </el-button>
              <el-button size="small" v-if="Type!==0" :disabled="communicateButtonDisabled" @click="Communication">
                <i class="icon iconfont icon-chat-with-doctor"></i>&nbsp;沟通
              </el-button>			
              <el-button size="small" v-if="Type===2||Type===3"  @click="checkflow">
                <i class="icon iconfont icon-liucheng"></i>&nbsp;流程
              </el-button>				
              <el-button size="small" v-if="Type===3"  @click="rejectRefund">
                <i class="icon iconfont icon-bohui"></i>&nbsp;驳回
              </el-button>		
              <el-button size="small" @click="editSave" v-if="Type===0||Type===1" :disabled="Type===2 || Type===3">
                <i class="icon iconfont icon-baocun"></i>&nbsp;保存
              </el-button>
              <el-button size="small" @click="editSubmit" v-if="Type===0||Type===1" :disabled="Type===2 || Type===3">
                <i class="icon iconfont icon-tijiao"></i>&nbsp;提交
              </el-button>
              <el-button size="small" @click="getPrint" v-if="Type===2">
                <i class="icon iconfont icon-yy"></i>&nbsp;打印
              </el-button>
              <el-button size="small" v-if="Type===3" @click="auditRefund">
                <i class="icon iconfont icon-shenhe"></i>&nbsp;同意
              </el-button>
            </el-button-group>
					</span>
				</div>
        <!-- 沟通 -->
      <!-- <el-dialog
        :visible.sync="dialogCommunicationVisible"
        :modal-append-to-body="false"
        size="tiny">
        <ul class="Communication" ref="content">
          <li v-for="(item,index) in CommunicationContentList" :key="index">
            <el-row>
              <el-col :span="2">
                <a href="javascript:;"><img :src="item.Img" alt="" class="round"/></a>
              </el-col>

              <el-col :span="22">              
                <div class="message1">
                  <p class="name"><el-tag type="success">{{item.CreateByName}}</el-tag></p>       
                  <p class="content">{{item.CC_Content}}</p>
                  <p class="date"><el-tag type="primary">{{item.SysCreateDate}}</el-tag></p>
                </div>
              </el-col>
            </el-row>
          </li>
          <li v-if="this.CommunicationContentList.length==0"><p class="not-communication"><i class="el-icon-warning"></i>未有沟通</p></li>
        </ul>
        <el-row v-if="this.communiTypes===3">
          <el-col :span="17">
            <el-select v-model="launch" multiple filterable="" allow-create placeholder="请选择沟通对象" style="width:80%;">
              <el-option v-for="(item,index) in LaunchList" :key="index" :label="item.RealName" :value="item.Id">
              </el-option>
            </el-select>
          </el-col>
          <el-col :span="2">
            <el-checkbox v-model="launchChecked" @change="launchChange(launchChecked)">允许提交者编辑单据</el-checkbox>
          </el-col>
        </el-row>
        <el-row v-if="(this.communiTypes!==0 && this.communiTypes!==2) || this.isshowLauch==true">
          <el-col :span="21">
            <el-input v-model="contentInput" placeholder="请输入内容"></el-input>
          </el-col>
          <el-col :span="2">          
            <el-button style="margin-left:10px;" type="primary" @click="CommunicationDetermine">发送</el-button>
          </el-col>          
        </el-row>
      </el-dialog> -->
      <!-- 沟通改版 -->
      <el-dialog
        class="el-dialog__body-padding"
        :visible.sync="dialogCommunicationVisible"
        :modal-append-to-body="false"
        size="tiny"
        style="line-height: normal;">
        <p v-if="CommunicationContentList.length!==0" class="title">沟通内容:</p>
        <ul v-if="CommunicationContentList.length!==0" class="Communication-Two mt-15 mb-15" ref="content">
          <li v-for="(item,index) in CommunicationContentList" :key="index" :class="index!==CommunicationContentList.length-1?'mb-10':''">
            <el-row>
              <el-col :span="4" class="Communication-left">
                <a href="javascript:;"><img :src="item.Img" alt="" class="round"/></a>
                <p class="name" style="color: #13ce66;">{{item.CreateByName}}</p>
              </el-col>
              <el-col :span="20" style="height: 78px;">              
                <div class="message1">      
                  <p class="content">{{item.CC_Content}}</p>
                  <p class="date"><el-tag type="primary">{{item.SysCreateDate}}</el-tag></p>
                </div>
              </el-col>
            </el-row>
          </li>
          <!-- <li v-if="this.CommunicationContentList.length==0"><p class="not-communication"><i class="el-icon-warning"></i>未有沟通</p></li> -->
        </ul>
        <p v-if="communiTypes===3" class="title">发起沟通:</p>
        <el-row v-if="communiTypes===3" class="padding-top-15">
          <el-col :span="17">
            <el-select v-model="launch" multiple filterable="" allow-create placeholder="请选择沟通对象" style="width:80%;">
              <el-option v-for="(item,index) in LaunchList" :key="index" :label="item.RealName" :value="item.Id">
              </el-option>
            </el-select>
          </el-col>
          <el-col :span="2">
            <el-checkbox v-model="launchChecked" @change="launchChange(launchChecked)">允许提交者编辑单据</el-checkbox>
          </el-col>
        </el-row>
        <!-- <el-row v-if="(this.communiTypes!==0 && this.communiTypes!==2) || this.isshowLauch==true">
          <el-col :span="21">
            <el-input v-model="contentInput" placeholder="请输入内容"></el-input>
          </el-col>
          <el-col :span="2">          
            <el-button style="margin-left:10px;" type="primary" @click="CommunicationDetermine">发送</el-button>
          </el-col>          
        </el-row> -->
        <!-- <p v-if="(this.communiTypes!==0 && this.communiTypes!==2) || this.isshowLauch==true" v-show="this.CommunicationContentList.length!==0" class="title padding-top-15">回复沟通:</p> -->
        <div v-if="(this.communiTypes!==0 && this.communiTypes!==2) || this.isshowLauch==true" v-show="this.CommunicationContentList.length!==0">
          <p v-if="this.communiTypes!==3" class="title padding-top-15">回复沟通:</p>
        </div>
        <el-row v-if="(this.communiTypes!==0 && this.communiTypes!==2) || this.isshowLauch==true" class="padding-top-15">
          <el-col :span="24">
            <el-input v-model="contentInput" type="textarea" :rows="3" placeholder="请输入内容"></el-input>
          </el-col>     
        </el-row>
        <el-row v-if="(this.communiTypes!==0 && this.communiTypes!==2) || this.isshowLauch==true" class="padding-top-15">
          <el-col :span="24">          
            <el-button style="float: right;" type="primary" @click="CommunicationDetermine">发送</el-button>
          </el-col>          
        </el-row>
      </el-dialog>       
			<!--流程图-->
			<el-dialog title="流程执行情况" :visible.sync="checkflowVisible" :modal-append-to-body="false" align="center">
				<el-table :data="docView2" header-align="center"  v-loading="docViewloading" element-loading-text="拼命刷新中...">
					<el-table-column property="PlanUser" label="操作人"></el-table-column>
					<el-table-column property="StepName" label="步骤名称"></el-table-column>
					<el-table-column property="OpDate" label="时间"></el-table-column>
					<el-table-column property="OpRemark" label="备注"></el-table-column>
				</el-table>
			</el-dialog>
			</div>
      <div class="flex-content">
        <!-- 中部 -->
        <main class="refund main">
          <div class="main-left"><!-- 0添加  1修改 2查看  3有审核权限 新增页面就不用显示单据-->
            <div v-if="Type == 1 || Type == 2 || Type == 3">					
              <h3>单号:</h3>
              <strong>{{DocNo}}</strong>
            </div>
            <div>
              <h3>日期：</h3>
              <div class="flex">
                <el-date-picker type="date" v-model="Repay_DocDate" placeholder="选择日期"  :disabled="Type===2 || Type===3">
                </el-date-picker>
              </div>
            </div>
            <div>
              <h3>还款金额</h3>
              <div class="comPay-wrapper">
                <strong class="comPay-icon">
                  <i class="icon iconfont icon-yue"></i>
                </strong>
                <div class="comPay-text">
                  <el-input type="text" @blur="doToFixedFn('Repay_TotalRepayMoney')" @keyup.native="onlyNumBasicFn('Repay_TotalRepayMoney')" v-model="Repay_TotalRepayMoney"  :disabled="Type===2 || Type===3"></el-input>
                </div>
              </div>
            </div>
          </div>
          <div class="main-right">
            <div class="right-form">
              <span>业务描述</span><br><br>
              <el-input
                type="textarea"
                :rows="10"
                placeholder="请输入内容"
                v-model="Repay_Title" 
                :disabled="Type===2 || Type===3">
              </el-input>
            </div>
          </div>
        </main>
        <!--底部-->
        <div class="budget-two">
          <div class="padding-size-10">
            <div class="nav"> <!--0添加 或 1修改 才允许添加行 否则只能查看-->
              <span>
                <i class="icon iconfont icon-iconfontcolor52"></i>核销借款</span>
                <!-- &#x3000;
                合计：<span class="Count">{{Count}} </span>
                <el-button  v-if="Type == 0 || Type == 1" class="add-button" size="small" @click="getOperaEditDialog">点击添加</el-button> -->
            </div>
            <el-dialog title="欠款明细" :visible.sync="dialogOperaVisible"  @close="cancel" :modal-append-to-body="false" align="center" size="small">
              <!-- 
                  修改 弹窗 借款单信息
                -->
              <el-table v-if="operationTemp" :data="operationTemp" border class="th-text-center" style="width:100%;" highlight-current-row max-height="300">
                <el-table-column label="借款单" width="120">
                  <template slot-scope="scope">
                  {{ scope.row.Borrow_DocNO }}
                  </template>
                </el-table-column>
                <el-table-column label="总金额" width="120">
                  <template slot-scope="scope">
                  {{ scope.row.Borrow_TotalBorrowMoney==0 ? '' : scope.row.Borrow_TotalBorrowMoney}}
                  </template>
                </el-table-column>
                <el-table-column label="未核销金额" width="120">
                  <template slot-scope="scope">
                  {{ scope.row.Surplus==0 ? '' : scope.row.Surplus}}
                  </template>
                </el-table-column>
                <el-table-column label="本次核销金额" class-name="full-box" width="150">
                  <template slot-scope="scope">
                    <el-input type="text" @keyup.native="onlyNumObjFn(scope,'row','Money')" @blur="doToFixed(scope,'row','Money')" :autofocus="true" v-model="scope.row.Money">
                    </el-input>
                  </template>
                </el-table-column>
                <el-table-column label="事由">
                  <template slot-scope="scope">
                  {{ scope.row.Borrow_Title }}
                  </template>
                </el-table-column>
              </el-table>
              <span slot="footer" class="dialog-footer">
                <el-button @click="cancel">取 消</el-button>
                <el-button type="primary" @click="confirm">确 定</el-button>
              </span>
            </el-dialog>

            <!--克隆 -->
            <el-table v-if="operaPrint" @click.native="getOperaEditDialog" @cell-mouse-enter="cellMouseEnterFn" @cell-mouse-leave="cellMouseLeaveFn" border class="th-text-center" :empty-text="'请点击添加核销借款明细'" :data="operaPrint" style="width: 100%;" highlight-current-row max-height="300">
              <el-table-column label="操作" width="80">
                <template slot-scope="scope">
                  <div class="text-align-center" v-if="scope.row.Borrow_DocNO==mouse_enter_Borrow_DocNO">
                    <button v-if="Type!==2&&Type!==3" size="small" @click.stop="changeMoneyToZero(scope)" class="oper-btn"><img class="common-icon" src="/static/content/images/Common/common-dele.png"/></button>
                  </div>                  
                </template>
              </el-table-column>               
              <el-table-column label="借款单" width="120">
                <template slot-scope="scope">
                  {{ scope.row.Borrow_DocNO }}
                </template>
              </el-table-column>
              <el-table-column label="总金额" width="120">
                <template slot-scope="scope">
                  {{ scope.row.Borrow_TotalBorrowMoney==0 ? '' : scope.row.Borrow_TotalBorrowMoney }}
                </template>
              </el-table-column>
              <el-table-column label="未核销金额" width="120">
                <template slot-scope="scope">
                  {{ scope.row.Surplus==0 ? '' : scope.row.Surplus }}
                </template>
              </el-table-column>
              <el-table-column label="本次核销金额" width="120">
                <template slot-scope="scope">
                  {{ scope.row.Money }}
                </template>
              </el-table-column>
              <el-table-column label="事由">
                <template slot-scope="scope">
                  {{ scope.row.Borrow_Title }}
                </template>
              </el-table-column>
            </el-table>
            <div class="clearfloat">
              <div class="total-box">合计：<span class="Count-text">{{Count}}</span></div>
            </div>             
          </div>
        </div>
      </div>
		</div>
    <el-dialog :visible.sync="dialogPrintVisible" :modal-append-to-body="false">
          <div class="printBox cover">
            <el-button size="small" class="center" @click.native="printPdf()">&#12288;打印&#12288;</el-button>
            <div id="form1">
              <table width="100%" border="0" v-loading="PrintLoading" element-loading-text="正在加载中">
              <caption>
                <h3 id="Doc">{{printsData.ER_Tite || ''}}</h3>
              </caption>
              <thead>
                <tr>
                  <td style="padding:15px 10px;line-height:30px;">
                    <div id="CompanyName" style="float:left">{{printsData.CompanyName || ''}}</div>
                    <div id="Current" style="float:right">打印日期：{{printsData.Current || ''}}</div>
                  </td>
                </tr>
              </thead>
              <tbody>
                <tr>
                  <td>
                    <div id="div" class="table-c">
                      <table cellpadding="3" width="100%" class="ListTable">
                        <tbody>
                          <tr>
                            <td class="tbTitle">单号</td>
                            <td class="Tabletd">{{printsData.entity ? printsData.entity.DocNo : '' }}</td>
                            <td class="tbTitle">申请人</td>
                            <td class="Tabletd">{{printsData.entity ? printsData.entity.CreateByName : ''}}</td>
                            <td class="tbTitle">申请部门</td>
                            <td class="Tabletd">{{printsData.entity ? printsData.entity.CreateByDeptName : ''}}</td>
                          </tr>
                          <tr>
                            <td class="tbTitle">单据日期</td>
                            <td class="Tabletd">{{printsData.entity ? printsData.entity.DocDateStr : ''}}</td>
                            <td class="tbTitle">还款金额</td>
                            <td class="Tabletd">{{printsData.entity ? printsData.entity.TotalRepayMoney : ''}}</td>
                            <td class="tbTitle">业务描述</td>
                            <td class="Tabletd">{{printsData.entity ? printsData.entity.Title : ''}}</td>
                          </tr>
                        </tbody>
                      </table>
                    </div>
                  </td>
                </tr>
                <tr>
                  <td style="line-height:30px;">&nbsp;</td>
                </tr>
                <tr>
                  <td>
                    <div id="Line" class="table-c">
                      <table width="100%" class="ListTable">
                        <thead>
                          <tr>
                            <td width="5%">NO</td>
                            <td>借款单号</td>
                            <td>借款日期</td>
                            <td>借款金额</td>
                            <td>欠款金额</td>
                            <td>本次还款金额</td>
                          </tr>
                        </thead>
                        <tbody>
                          <tr v-for="(p,index) in printsData.entity.RepayLineSet" :key="index">
                            <td>{{index+1}}</td>
                            <td>{{p.BorrowDocNo ? p.BorrowDocNo : ''}}</td>
                            <td>{{p.BorrowDocDate ? p.BorrowDocDate : ''}}</td>
                            <td>{{p.TotalBorrowMoney && p.TotalBorrowMoney ? p.TotalBorrowMoney.toFixed(2) :''}}</td>
                            <td>{{p.CurrentLeaveMoney && p.CurrentLeaveMoney ? p.CurrentLeaveMoney.toFixed(2) :''}}</td>
                            <td>{{p.RepayMoney && p.RepayMoney ? p.RepayMoney.toFixed(2) :''}}</td>                            
                          </tr>
                          <tr>
                            <td colspan="5">合计</td>
                            <td>{{printsData.entity && printsData.entity.RepayLineSetMoney ? printsData.entity.RepayLineSetMoney.toFixed(2):'0.00'}}</td>
                          </tr>
                        </tbody>
                      </table>
                    </div>
                  </td>
                </tr>
                <tr>
                  <td style="line-height:30px;">&nbsp;</td>
                </tr>
                <tr>
                  <td>
                    <div id="Line" class="table-c">
                      <table width="100%" class="ListTable">
                        <thead>
                          <tr>
                            <td width="5%">NO</td>
                            <td>处理人</td>
                            <td>处理结果</td>
                            <td>备注</td>
                            <td>处理日期</td>
                          </tr>
                        </thead>
                        <tbody>
                          <tr v-for="(p,index) in printsData.Chart" :key="index">
                            <td>{{index+1}}</td>
                            <td>{{p.PlanUser ? p.PlanUser : ''}}</td>
                            <td>{{p.StepName ? p.StepName : ''}}</td>
                            <td>{{p.OpRemark ? p.OpRemark : ''}}</td>
                            <td>{{p.OpDate ? p.OpDate : ''}}</td>
                          </tr>
                        </tbody>
                      </table>
                    </div>
                  </td>
                </tr>
                <tr>
                  <td>&nbsp;</td>
                </tr>
                <tr>
                  <!--审批流-->
                  <td>
                    <div id="Chart" class="table-c"></div>
                  </td>
                </tr>
              </tbody>
            </table>
            </div>
      </div>
    </el-dialog>
    <!--附件-->
    <el-dialog title="附件" :visible.sync="dialogUploadVisible" :modal-append-to-body="false" >
        <label for="file" class="label-file" v-if="Type!=2&&Type!=3"><i class="icon iconfont icon-shangchuan">&nbsp;</i>上传</label>
        <input name="file" id="file" type="file" accept="*" @change="update" multiple/>
        <div><br></div>
        <ul ref="images" style="display:none">
          <li v-for="(item, index) in UploadList" :key="index">
            <!-- <img :src="`http://192.168.1.188:8011/${item.Attachment_Url}`" :alt="item.Attachment_FileName"> -->
            <img :src="item.Attachment_Url" :alt="item.Attachment_FileName">            
          </li>
        </ul>
        <el-table :data="UploadList" header-align="center" id="test">
          <el-table-column property="ID" label="ID" width="100"></el-table-column>
          <el-table-column property="Attachment_UploadDate" label="日期" :formatter="formatUploadDate"></el-table-column>
          <el-table-column property="Attachment_FileName" label="名称" show-overflow-tooltip></el-table-column>          
          <el-table-column label="操作" max-width="100">
            <template slot-scope="scope">
              <div style="display:inline-block;">
                <el-button v-if='isShowPreview(scope.row.Attachment_FileName)' type="info" size="small" @click="preview(scope)">
                  &#12288;<i class="el-icon-search"></i>预览&#12288;
                </el-button>
              </div>
              <a class="down" :href="scope.row.Attachment_Url" :download='scope.row.Attachment_FileName'>下载</a>
              <el-button type="danger" v-if="Type!=2&&Type!=3" size="small" @click="DeleUpload(scope.$index, scope.row)">&#12288;删除&#12288;</el-button>
            </template>
          </el-table-column>
        </el-table>
    </el-dialog>
    <!--查询-->
    <el-dialog title="查询" :visible.sync="dialogSearchVisible" :modal-append-to-body="false" size="tiny">
      <el-form :model="Searchform">
        <el-form-item label="金  额 ：" :label-width="formLabelWidth">
          <el-input v-model.number.trim="Searchform.StartMoney" auto-complete="off" style="width:120px;"></el-input>
          至&nbsp;<el-input v-model.number.trim="Searchform.EndMoney" auto-complete="off" style="width:120px;"></el-input>
        </el-form-item>
        <el-form-item label="日  期 ：" :label-width="formLabelWidth">
          <el-date-picker type="date" v-model="Searchform.StartDate" style="width:120px;" placeholder="选择日期"></el-date-picker>
          至&nbsp;<el-date-picker type="date" v-model="Searchform.EndDate" style="width:120px;" placeholder="选择日期"></el-date-picker>
        </el-form-item>
        <el-form-item label="单  号 ：" :label-width="formLabelWidth">
          <el-input v-model="Searchform.DocNo" style="width:262px;"></el-input>
        </el-form-item>
        <el-form-item label="标  题 ：" :label-width="formLabelWidth">
          <el-input v-model="Searchform.Title" style="width:262px;"></el-input>
        </el-form-item>
        <el-form-item label="状 态 ：" :label-width="formLabelWidth">
          <el-select v-model="Searchform.DocStatus" style="width:262px;" placeholder="请选择">
            <el-option value="" label="全部">全部</el-option>
            <el-option
              v-for="item in StatusOptions"
              :key="item.Code"
              :label="item.Name"
              :value="item.Code">
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer cover">
        <el-button size="small" @click="Reset">重 置</el-button>
        <el-button size="small" @click="Query">确 定</el-button>
      </div>
    </el-dialog>
	</section>
</template>
<script>
import moment from 'moment';
function getQueryParam(name, url) {
  //URL GET 获取值
  var reg = new RegExp("(^|\\?|&)" + name + "=([^&]*)(\\s|&|$)", "i"),
    Url = url || location.href;
  if (reg.test(Url)) return decodeURI(RegExp.$2.replace(/\+/g, " "));
  return "";
}
export default {
  name: "refundMoney",
  data() {
    return {
      viewer: null, //viewer对象
      showNum: "", //传过来的参数
      total: 0, //数据总数
      rows: 100, //每页显示多少条
      currentPage: 1,//当前页数
      isshowList: true, //table表单显隐
      isshowAdd: false, //新建页面显隐
      isshowEdit: false, //修改页面显隐
      refundList: [], //还款单列表
      UploadList: [], //附件列表数据
      PrintLoading: true, //显示打印loading
      Repay_DocDate: "", //日期
      Repay_Title: "", //业务描述
      dialogPrintVisible:false,//打印
      dialogSearchVisible:false,//查询窗口
      formLabelWidth:'120px',
      Type: 0, //状态
      docType: "",
      Repay_TotalRepayMoney: 0,
      Msg: "", //审核提醒
      docView: [], //流程图列表
      docView2: [], //流程图列表
      hxje: [],
      DocNo: "", //还款单号
      // 添加弹框的数组
      operationTemp: [],
      StatusOptions:[],//状态列表
      operaPrint: [
        {
          Borrow_DocNO: "",
          Borrow_Title: "",
          Borrow_TotalBorrowMoney: 0,
          Surplus: 0,
          Money: 0
        }
      ],
      Searchform: {
          StartMoney:"",
          EndMoney:"",
          StartDate:'',
          EndDate:'',
          DocNo:'',
          Title:'',
          DocStatus:''
      },
      printsData: {
        entity: {
          BorrowLineSet: []
        }
      },//打印的数据
      loading: false,
      docViewloading: false,//流程图
      dialogOperaVisible: false,
      dialogUploadVisible: false,//上传窗口
      checkflowRowVisible: false, //外面的流程图
      checkflowVisible: false, //里面的流程图
      formLabelWidth:'120px',
      //沟通模块
      dialogCommunicationVisible:false,//沟通窗口      
      CommunicationContentList:[],//沟通内容列表
      contentInput:'',//输入内容Model
      acquiescenceImg:'static/content/images/Header-S.png',//默认头像
      LaunchList:[],//沟通对象集合
      launch:[],//沟通对象
      launchChecked:false,//是否允许编辑
      requestEmp:'',//申请人ID
      communiTypes:0,//获取沟通状态
      isshowLauch:false,
      DocType: 303,//单据类型 报销单=301 借款单=302  还款单=303 收入确认单=304  出纳付款=401  出纳收款=402
      mouse_enter_Borrow_DocNO:"",//鼠标移入当前行的单号
      communicateButtonDisabled:false,//沟通按钮是否置灰
      fjBtnDisabled: true,//附件按钮置灰true
    };
  },
  /**
   * 过滤器
   */
  methods: {
    changeMoneyToZero(obj){//核销借款操作删除，改变operaPrint，并且改变弹框数据;如果表格行数为零，隐藏表格
      this.operationTemp.map(item=>{
        if (item.Borrow_DocNO==this.operaPrint[obj.$index].Borrow_DocNO) {
          item.Money=""
        }
      })
      this.operaPrint.splice(obj.$index, 1);
    },
    cellMouseEnterTwoFn(...arr){//主页鼠标移速单元格触发事件
      this.mouse_enter_Borrow_DocNO=arr[0].Repay_DocNO
    },
    cellMouseEnterFn(...arr){//鼠标移速单元格触发事件
      this.mouse_enter_Borrow_DocNO=arr[0].Borrow_DocNO
    },
    cellMouseLeaveFn(){
      this.mouse_enter_Borrow_DocNO=""
    },    
    /* 时间过滤器 */
    formatDate(row, column) {
      return row.Repay_CreateDate.split("T", 1);
    },
    formatUploadDate(row, column) {
      return row.Attachment_UploadDate.split("T", 1);
    },
    changePage(page) {//当前页数
      this.currentPage = page;
      this.getList();
    },
    async getList() {
      this.loading = true;
      const res = await axios.get("getRefundList", {
          page: this.currentPage, //一页
          rows: this.rows//显示100条
      }); 
      this.total = res.total;//总页数
      this.refundList = res.rows;
      this.refundList.forEach(item => {item.Repay_TotalRepayMoney = item.Repay_TotalRepayMoney.toFixed(2);});
      this.loading = false;
    },
    /*
     *  查询 
     */
    async Query(){
      if(new Date(this.Searchform.StartDate)>new Date(this.Searchform.EndDate)){
        console.log(new Date(this.Searchform.StartDate),'this.Searchform.StartDate')
        console.log(new Date(this.Searchform.EndDate),'this.Searchform.EndDate')
        this.$message({
          message: '开始日期必须小于或者等于结束时期！',
          type: 'warning',
          duration: 1200
        });
        return;
      }else if(this.Searchform.StartMoney>this.Searchform.EndMoney){
        this.$message({
          message: '开始金额必须小于或者等于结束金额！',
          type: 'warning',
          duration: 1200
        });
        return;
      }
      this.dialogSearchVisible = false;
      console.log(this.Searchform.StartDate ? moment(this.Searchform.StartDate).format('L') : '','1');
      console.log(this.Searchform.EndDate ? moment(this.Searchform.EndDate).add(1,"d").format('L') : '','2');
      let filterName = {
        "groupOp": "AND",
        "rules": [{
          "field": "Repay_DocNO",
          "dataType": "string",
          "op": "cn",
          "data": this.Searchform.DocNo || ''
        }, {
          "field": "Repay_Title",
          "dataType": "string",
          "op": "cn",
          "data": this.Searchform.Title || ''
        },{
          "field": "Repay_DocStatus",
          "dataType": "numeric",
          "op": "eq",
          "data": this.Searchform.DocStatus || ''
        }, {
          "field": "Repay_TotalRepayMoney",
          "dataType": "numeric",
          "op": "ge",
          "data": this.Searchform.StartMoney || ''
        }, {
          "field": "Repay_TotalRepayMoney",
          "dataType": "numeric",
          "op": "le",
          "data": this.Searchform.EndMoney || ''
        }, {
          "field": "Repay_DocDate",
          "dataType": "string",
          "op": "ge",
          "data": this.Searchform.StartDate ? moment(this.Searchform.StartDate).format('L') : ''
        }, {
          "field": "Repay_DocDate",
          "dataType": "string",
          "op": "le",
          "data": this.Searchform.EndDate ? moment(this.Searchform.EndDate).add(1,"d").format('L') : ''
        }],
        "groups": []
      }
      this.loading = true;
      const res = await axios.post("getRefundList", { 
        filter:JSON.stringify(filterName),
        page:this.currentPage,
        rows:this.rows,
      });
      this.total = res.total;//总页数
      this.refundList = res.rows;
      this.loading = false;
    },
    Reset(){
      this.Searchform = {
          StartMoney:"",
          EndMoney:"",
          StartDate:'',
          EndDate:'',
          DocNo:'',
          Title:'',
          DocStatus:''
      }
    },
    search(){
      this.dialogSearchVisible = true;
      this.getStatusList();
    },
    async getStatusList(){
      this.StatusOptions = await axios.get('getStatusList');
    },
    /**
     * 打印窗口
     */
    async getPrint(){
      this.dialogPrintVisible = true;
      this.PrintLoading = true;
      const res = await axios.get("Print",{DocNo:this.DocNo,DocType: this.DocType});
      this.printsData = res;
      this.PrintLoading = false;      
    },
    // 新建返回到列表页面
    addToBack() {
      this.isshowAdd = false; //新建页面隐藏
      this.isshowList = true; //列表页面显示
      this.getList();
    },
    // 编辑页面显隐
    editToBack() {
      this.isshowEdit = false; //编辑页面隐藏
      this.isshowList = true; //列表页面显示
      this.getList();
    },
    repaintDataFn(){//打开核销借款弹框，数据回填到弹框
      if (this.operaPrint.length > 0) {
        // 取原列表数据
        const tempArr = JSON.parse(JSON.stringify(this.operationTemp)); //原数据
        // 将operaPrint 中金额不为0 的 数据对应 赋值给相应的
        for (let i = 0; i < tempArr.length; i++) {
          for (let t = 0; t < this.operaPrint.length; t++) {
            if (tempArr[i].ID == this.operaPrint[t].ID) {
              //如果循环的ID相同的话
              tempArr[i].Money = this.operaPrint[t].Money; //就赋值Money
            }
          }
        }
        this.operationTemp = tempArr; //operationTemp =>最终呈现在列表上的data
      } 
    },
    getOperaAddDiaLog() {
      // -------打开核销借款弹框，数据回填到弹框-----------//
      this.repaintDataFn()
      // ---------------------------------------//
      //弹窗显示 获取还款单列表
      if(this.operationTemp.length<=0){
        axios.post("RefundDetail",{
            key:this.DocNo //报销单编号
        }).then(res => {//直接赋值到窗口的表格上
          this.operationTemp = res.ER_Borrow;
          this.operationTemp.forEach(item => {
            item.Borrow_TotalBorrowMoney = item.Borrow_TotalBorrowMoney.toFixed(2);
            item.Surplus = item.Surplus.toFixed(2);
            item.Money = item.Money === 0 ? "" : item.Money.toFixed(2);
          });
        }).catch(err => {
          console.log(err);
        });
      }
      this.dialogOperaVisible = true;
    },
    cancel() {
      //取消按钮 关闭窗口
      this.dialogOperaVisible = false;
      //点击取消，上面表格数组过滤
      this.operationTemp.forEach(aItem=>{
        if(this.operaPrint.findIndex(bItem=>bItem.Borrow_DocNO==aItem.Borrow_DocNO)==-1){
          aItem.Money=""
        }
      })

    },
    getOperaEditDialog() {
      if(this.Type==2||this.Type==3){
        return;
      }
      // -------打开核销借款弹框，数据回填到弹框-----------//
      this.repaintDataFn()
      // ---------------------------------------//
      if(this.operationTemp.length<=0){
        axios
          .post("RefundDetail", {
            key: this.DocNo //还款编号
          })
          .then(res => {//直接赋值到窗口的表格上
            this.operationTemp = res.ER_Borrow;
            this.operationTemp.forEach(item => {
              item.Borrow_TotalBorrowMoney = item.Borrow_TotalBorrowMoney.toFixed(2);
              item.Surplus = item.Surplus.toFixed(2);
              item.Money = item.Money === 0 ? "" : item.Money.toFixed(2);
            });
          })
          .catch(err => {
            console.log(err);
          });
      }
      this.dialogOperaVisible = true;
    },
    confirm() {
      //打印到备用数组上
      let myArr = []; //为了传参
      const tempArr = JSON.parse(JSON.stringify(this.operationTemp)); //operationTemp =>最终呈现在列表上的data
      this.operaPrint = [];
      tempArr.map(item => {
        //不为0的 才push上去
        item.Money = Number(item.Money).toFixed(2); //先转数字类型，再保留两位小数
        if (item.Money != 0.0 && item.Money != 0) {
          this.operaPrint.push(item);
        }
      });
      //只为传参
      let operaPrint = this.operaPrint;
      operaPrint.forEach(value => {
        let money = value.Money; //金额
        let docNo = value.Borrow_DocNO; //编号
        let temp = `{"je":${money},"ID":"${docNo}"}`;
        myArr.push(temp);
      });
      this.hxje = myArr.join(","); //逗号分割并拼接备份给json字符串传参
      this.hxje = `[` + this.hxje + `]`;
      this.dialogOperaVisible = false; //关闭弹窗
    },
    
    // 审核 /  申请 页面 
    AuditAndApply() {
      this.showNum = getQueryParam("showNum");
      this.DocNo = getQueryParam("key");
      if (this.showNum === "2") {
        //2的时候是编辑页
        this.isshowEdit = true;
        this.isshowList = false;
        this.isshowAdd = false;
      }
      axios
        .post("RefundDetail", {
          key: this.DocNo //还款编号
        })
        .then(res => {
          this.operationTemp = [];
          this.Repay_DocDate = res.entity.Repay_DocDate; //日期
          this.Repay_Title = res.entity.Repay_Title; //业务描述
          this.communiTypes = res.AllowCommunication;//获得沟通对象
          this.Repay_TotalRepayMoney = res.entity.Repay_TotalRepayMoney; //还款金额
          this.Type = res.Type; //0添加  1修改 2查看  3有审核权限
          if (this.Type==1) {//修改状态附件按键亮起
            this.fjBtnDisabled=false;
          }else{//查看和待审核状态，有附件数才亮起
            this.fjBtnDisabled = res.FJNum==0?true:false;
          } 
          this.operation = res.ER_Borrow;
          this.operaPrint = res.ER_Borrow;
          /**
           * 先获取到借款单信息 然后不为0的才加载上去
           */
          const tempArr = JSON.parse(JSON.stringify(this.operaPrint)); //浅拷贝数组
          this.operaPrint = []; //先清空
          tempArr.map(item => {
            //不为0的 才push上去
            if (item.Money != 0) {
              this.operaPrint.push(item);
            }
          });
          let This=this;             
          this.getMayHaveCommunicationFn({key:This.DocNo,DocType:This.DocType,type:this.Type}).then((res)=>{
            This.communicateButtonDisabled=false
            //判断状态获取沟通
            if(this.communiTypes==1||this.communiTypes==2){ 
              this.dialogCommunicationVisible = true;
              this.isshowLauch = false;
              let all = [
                axios.get('CommunicationContent',{
                  key:this.DocNo,
                  DocType:this.DocType
                }),
                axios.get('LaunchList',{
                  key:this.DocNo,
                  DocType:this.DocType
                }),
              ];
              this.axios.all(all).then(
                this.axios.spread((res1,res2)=>{
                  this.CommunicationContentList = res1;//获得沟通内容
                    for(var i=0;i<this.CommunicationContentList.length;i++){
                      if(this.CommunicationContentList[i].Img==''){//如果是空的
                        const ac = this.acquiescenceImg;
                        this.CommunicationContentList[i].Img = ac;//赋值默认头像
                      }
                    }
                    this.requestEmp = res2.RequestEmp;//申请人ID
                    this.LaunchList = res2.us;//获得沟通对象  
                })
              )   
            }
          }).catch((err)=>{
            This.communicateButtonDisabled=true
          })
        })
        .catch(err => {
          console.log(err);
        });
    },
    
    //沟通窗口打开 
    Communication(){
      this.dialogCommunicationVisible = true;
      this.isshowLauch=false;
      let all = [
          axios.get('CommunicationContent',{
            key:this.DocNo,
            DocType:this.DocType
          }),
          axios.get('LaunchList',{
            key:this.DocNo,
            DocType:this.DocType
          }),
          axios.get('getCommuniState',{
            key:this.DocNo,
            DocType:this.DocType,
            types:this.Type
          })
      ];
      this.axios.all(all).then(
        this.axios.spread((res1,res2,res3)=>{
            this.CommunicationContentList = res1;//获得沟通内容
            for(var i=0;i<this.CommunicationContentList.length;i++){
              if(this.CommunicationContentList[i].Img==''){//如果是空的
                const ac = this.acquiescenceImg;
                this.CommunicationContentList[i].Img = ac;//赋值默认头像
              }
            }
            this.requestEmp = res2.RequestEmp;//申请人ID
            this.LaunchList = res2.us;//获得沟通对象  
            this.communiTypes = res3;//获取沟通状态
        })
      )   
    },
    //允许提交者编辑单据Change事件
    launchChange(e){
      console.log(e,'e');
      if(e){
        console.log(this.requestEmp,'this.requestEmp');
        console.log(this.launch,'this.launch');
        let bo=true;
        for(let i=0;i<this.launch.length;i++)
        { 
          if(this.launch[i]==this.requestEmp)
          bo=false;      
        }
        if(bo)this.launch.push(this.requestEmp);
      }
    },
    //确认后提交
    CommunicationDetermine(){
      if(this.isshowLauch == true)
      {
        this.$confirm('回复沟通单据将会自动提交，不可再编辑!', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
           this.Communicate();
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消'
          });           
        });
      }else{
        this.Communicate();
      }
    },
    //沟通窗口 确定按钮
    Communicate(){
      let user='';
      for(let i=0;i<this.launch.length;i++)
      { 
          user+=i!=0?',':'';
          user+=this.launch[i];
      }    
      console.log(user,'user');
       
      axios.get('AddCommunicate',{
          key:this.DocNo,
          DocType:this.DocType,
          msg:this.contentInput,
          user:user,
          bj:this.launchChecked ? 1 : 0,
          type:this.communiTypes
      }).then(res=>{
          if(res.Success===true){
            if(this.isshowLauch == true)
            this.SubmitForm();
            //获得沟通内容
            this.getContent();
            this.$message({
              message: res.Message,
              type: 'success',
              duration: 1200
            })
            this.getState();
            this.contentInput = '';
            
          }else{
            this.$message({
              message: res.Message,
              type: 'warning',
              duration: 1200
            })
          }
      }).catch(err=>{
          console.log(err);
      })      
    },
    //获取内容
    getContent(){
      axios.get('CommunicationContent',{
        key:this.DocNo,
        DocType:this.DocType
      }).then(res=>{
        this.CommunicationContentList = res;
        for(var i=0;i<this.CommunicationContentList.length;i++){
            if(this.CommunicationContentList[i].Img==''){//如果是空的
                const ac = this.acquiescenceImg;
                this.CommunicationContentList[i].Img = ac;//赋值默认头像
            }
        }    
      })
    },
    //获取type
    getState(){
      axios.get('getCommuniState',{
        key:this.DocNo,
        DocType:this.DocType,
        types:this.Type
      }).then(res=>{
        this.communiTypes = res;
        console.log(this.communiTypes,'type1');        
      }).catch(err=>{
        console.log(err);
      })
    },
    
    // 撤销
    repeal(index, row) {
      this.$confirm("确认撤销该记录吗?", "提示", {
        type: "warning"
      })
        .then(() => {
          axios
            .post("revokeRefund", {
              key: row.Repay_DocNO
            })
            .then(res => {
              this.$message({
                message: res.Message,
                type: "success"
              });
              this.getList();
            })
            .catch(err => {
              console.log(err);
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消撤销"
          });
        });
    },
    /**
     *  显示新增界面	
     */
    handleAdd() {
      this.isshowAdd = true; //新建页面显示
      this.isshowList = false; //列表页面隐藏
      /**
       * 打开新增页面时顺便清空下数据
       */
      this.operaPrint = []; //明细
      // this.operaPrint=[
      //   {
      //     Borrow_DocNO: "",
      //     Borrow_Title: "",
      //     Borrow_TotalBorrowMoney: 0,
      //     Surplus: 0,
      //     Money: 0
      //   }
      // ]
      this.operationTemp = [];
      this.DocNo = '';
      this.Repay_Title = ""; //业务描述
      this.Repay_DocDate = new Date(); //日期
      if (this.Repay_TotalRepayMoney == 0 || this.Repay_TotalRepayMoney != "") {
        //如果是 0 或者不为空 都要清空
        this.Repay_TotalRepayMoney = "";
      }
    },
    /*
     *	显示编辑界面
     */
    // handleEdit(index, row) {
    handleEdit(...rest) {
      let row=rest[0];  
      this.isshowEdit = true; //编辑显示
      this.isshowList = false; //列表隐藏
      this.DocNo = row.Repay_DocNO; //还款编号
      this.docType = row.DocStatus;
      this.operationTemp = [];
      axios
        .post("RefundDetail", {
          key: this.DocNo //还款编号
        })
        .then(res => {
          this.Repay_DocDate = res.entity.Repay_DocDate; //日期
          this.Repay_Title = res.entity.Repay_Title; //业务描述
          this.communiTypes = res.AllowCommunication;//获得沟通对象
          this.Repay_TotalRepayMoney = res.entity.Repay_TotalRepayMoney.toFixed(
            2
          ); //还款金额
          this.Type = res.Type; //0添加  1修改 2查看  3有审核权限
          if (this.Type==1) {//修改状态附件按键亮起
            this.fjBtnDisabled=false;
          }else{//查看和待审核状态，有附件数才亮起
            this.fjBtnDisabled = res.FJNum==0?true:false;
          }        
          this.operaPrint = res.ER_Borrow;
          /**
           * 先获取到借款单信息 然后不为0的才加载上去
           */
          const tempArr = JSON.parse(JSON.stringify(this.operaPrint)); //浅拷贝数组
          this.operaPrint = []; //先清空
          tempArr.map(item => {
            //不为0的 才push上去
            item.Borrow_TotalBorrowMoney = Number(item.Borrow_TotalBorrowMoney);
            item.Surplus = Number(item.Surplus);
            item.Money = Number(item.Money);
            if (item.Money !== 0) {
              this.operaPrint.push(item);
            }
          });
          console.log(this.operaPrint,'this.operaPrint');
          let This=this;             
          this.getMayHaveCommunicationFn({key:This.DocNo,DocType:This.DocType,type:this.Type}).then((res)=>{
            This.communicateButtonDisabled=false
            //如果type===1或===2就弹出沟通窗口
            //判断状态获取沟通
            if(this.communiTypes==1||this.communiTypes==2){ 
              this.dialogCommunicationVisible = true;
              this.isshowLauch = false;
              let all = [
                axios.get('CommunicationContent',{
                  key:this.DocNo,
                  DocType:this.DocType
                }),
                axios.get('LaunchList',{
                  key:this.DocNo,
                  DocType:this.DocType
                }),
              ];
              this.axios.all(all).then(
                this.axios.spread((res1,res2)=>{
                  this.CommunicationContentList = res1;//获得沟通内容
                    for(var i=0;i<this.CommunicationContentList.length;i++){
                      if(this.CommunicationContentList[i].Img==''){//如果是空的
                        const ac = this.acquiescenceImg;
                        this.CommunicationContentList[i].Img = ac;//赋值默认头像
                      }
                    }
                    this.requestEmp = res2.RequestEmp;//申请人ID
                    this.LaunchList = res2.us;//获得沟通对象  
                })
              )   
            }
          }).catch(err=>{
            This.communicateButtonDisabled=true
          })
        })
        .catch(err => {
          console.log(err);
        });
    },
    //审核提示
    checkMsg() {
      axios.get("checkMsg").then(res => {
        this.Msg = res;
      }).catch(err => {
        console.log(err);
      });
    },
    //驳回还款单提示
    rejectRefund(){ 
      axios
        .get('ExamineCommunication',{
          key:  this.DocNo,
          DocType:  this.DocType
        }).then(res => {
          if(res.Data === '1'){
            this.$confirm(res.Message, '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {
              this.IsRejectRefund();
            }).catch(() => {
                this.$message({
                type: "info",
                message: "已取消"
              });
            });
          }else
            this.IsRejectRefund();
        })
        .catch(err => {
          console.log(err);
        })
    },
    //驳回还款单 操作
    IsRejectRefund() {
      this.DocNo = getQueryParam("key");
      this.$prompt("请您输入驳回的理由", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消"
      })
        .then(({ value }) => {
          this.$message({
            type: "success",
            message: "你的驳回的理由是：" + value
          });
          axios
            .get("rejectRefund", {
              key: this.DocNo,
              type: 1, //0审核 1驳回
              Reason: value
            })
            .then(res => {
              this.$message({
                message: res,
                type: "success"
              });
              setTimeout(() => {
                this.$router.push({
                  path: "notAudit"
                });
              }, 500);
            })
            .catch(err => {
              console.log(err);
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消"
          });
        });
    },
    //审核还款单 操作
    auditRefund() {
      axios
        .get('ExamineCommunication',{
          key:  this.DocNo,
          DocType:  this.DocType
        }).then(res => {
          if(res.Data === '1'){
            this.$confirm(res.Message, '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {
              this.ToExamineBorrow();
            }).catch(() => {
                this.$message({
                type: "info",
                message: "已取消"
              });
            });
          } else if(res.Data === '2') {
            this.$message({
              type: "warning",
              message: res.Message
            });
          }else
            this.ToExamineBorrow();
        })
        .catch(err => {
          console.log(err);
        })
    },
    //审核借款单 操作
    ToExamineBorrow() {
      this.DocNo = getQueryParam("key");
      this.checkMsg(); //审核提示
      this.$confirm(this.Msg, {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          axios
            .get("auditRefund", {
              key: this.DocNo,
              type: 0 //0审核 1驳回
            })
            .then(res => {
              this.$message({
                type: "success",
                message: res
              });
              setTimeout(() => {
                this.$router.push({
                  path: "notAudit"
                });
              }, 500);
            })
            .catch(err => {
              console.log(err);
            });
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消"
            });
          });
    },
    
    //里面的流程图
    checkflow() {
      this.checkflowVisible = true;
      this.docViewloading = true;
      axios
        .get("checkFlow", {
          DocNo: this.DocNo, //单据编号
          DocType: this.DocType //类型为还款单
        })
        .then(res => {
          this.docView = res;
          setTimeout(() => {
            this.docViewloading = false;
          }, 800);
        })
        .catch(err => {
          console.log(err);
        });
    },
    //外面的流程图
    checkflowRow(index, rows) {
      this.checkflowRowVisible = true;
      let DocNo = rows.Repay_DocNO;
      if (this.checkflowRowVisible == true) {
        if (rows.DocStatus == "新建") {
          //如果是新建状态就直接给个提示
          this.checkflowRowVisible = false;
          this.$message({
            message: "新建状态未有流程图",
            type: "warning",
            duration: 1200
          });
        } else if (rows.DocStatus == "无效") {
          //如果是无效状态也直接给个提示
          this.checkflowRowVisible = false;
          this.$message({
            message: "未找到相对应的流程图",
            type: "warning",
            duration: 1200            
          });
        } else {
          //否则直接请求拿列表数据
          this.docViewloading = true;
          axios
            .get("checkFlow", {
              DocNo: DocNo, //单据编号
              DocType: this.DocType //类型为还款单
            })
            .then(res => {
              this.docView = res;
              this.docViewloading = false;
            })
            .catch(err => {
              console.log(err);
            });
        }
      }
    },
    //删除
    handleDel(index, row) {
      this.$confirm("确认删除该记录吗?", "提示", {
        type: "warning"
      }).then(() => {
        axios
          .post("deleRefund", {
            key: row.Repay_DocNO
          })
          .then(res => {
            if (res.Success == false) {
              this.$message({
                message: res.Message,
                type: "warning",
                duration: 1200             
              });
            } else {
              this.$message({
                message: res.Message,
                type: "success",
                duration: 1500                
              });
              this.getList();
            }
          })
          .catch(err => {
            console.log(err);
          });
      });
    },
    /**
     * 新增页面 的提交事件
     */
    addSubmit() {
      let myArr = []; //为了传参
      let operaPrint = this.operaPrint;
      operaPrint.forEach(value => {
        let money = value.Money; //金额
        let docNo = value.Borrow_DocNO; //编号
        let temp = `{"je":${money},"ID":"${docNo}"}`;
        myArr.push(temp);
      });
      this.hxje = myArr.join(","); //逗号分割并拼接备份给json字符串传参
      this.hxje = `[` + this.hxje + `]`;
      let params = {
          Repay_DocStatus: 2, //2是提交
          Repay_DocDate: this.Repay_DocDate, //日期
          Repay_Title: this.Repay_Title, //描述标题
          Repay_TotalRepayMoney: this.Repay_TotalRepayMoney, //金额
          hxje: this.hxje, //明细json字符串
          key: this.DocNo
        };
        axios.post("submitRefund",params)
        .then(res => {
          if (res.Success == true) {
            this.$message({
              message: `提交成功`,
              type: "success",
              duration: 1200              
            });
            this.isshowEdit = false;   
            this.isshowAdd = false;
            this.isshowList = true;
            this.getList();
          } else {
            this.$message({
              message: res.Message,
              type: "warning",
              duration: 1500              
            });
          }
        })
        .catch(err => {
          this.$message.error(res.Message);
        });
    },
    /**
     * 新增页面 的保存事件
     */
    addSave() {
      let myArr = []; //为了传参
      let operaPrint = this.operaPrint;
      operaPrint.forEach(value => {
        let money = value.Money; //金额
        let docNo = value.Borrow_DocNO; //编号
        let temp = `{"je":${money},"ID":"${docNo}"}`;
        myArr.push(temp);
      });
      this.hxje = myArr.join(","); //逗号分割并拼接备份给json字符串传参
      this.hxje = `[` + this.hxje + `]`;
      axios
        .post("submitRefund", {
          Repay_DocStatus: 1, //1是保存
          Repay_DocDate: this.Repay_DocDate, //日期
          Repay_Title: this.Repay_Title, //描述标题
          Repay_TotalRepayMoney: this.Repay_TotalRepayMoney, //金额
          hxje: this.hxje, //明细json字符串
          key: this.DocNo
        })
        .then(res => {
          if (res.Success == true) {
            this.$message({
              message: `保存成功`,
              type: "success",
              duration: 1200              
            });
            if(res.data.DocNO){
              this.DocNo = res.data.DocNO;
            }
          } else {
            this.$message({
              message: res.Message,
              type: "warning",
              duration: 1500              
            });
          }
        })
        .catch(err => {
          this.$message.error(res.Message);
        });
    },

    /**
      * 编辑页面 的提交事件
      */
    SubmitForm() {
      let myArr = []; //为了传参
      let operaPrint = this.operaPrint;
      operaPrint.forEach(value => {
        let money = value.Money; //金额
        let docNo = value.Borrow_DocNO; //编号
        let temp = `{"je":${money},"ID":"${docNo}"}`;
        myArr.push(temp);
      });
      this.hxje = myArr.join(","); //逗号分割并拼接备份给json字符串传参
      this.hxje = `[` + this.hxje + `]`;
      let params={
          key: this.DocNo, //还款单据编号
          Repay_DocStatus: 2, //2是提交
          Repay_DocDate: this.Repay_DocDate, //日期
          Repay_Title: this.Repay_Title, //描述标题
          Repay_TotalRepayMoney: this.Repay_TotalRepayMoney, //金额
          hxje: this.hxje //明细json字符串
      }
      axios
        .post("submitRefund",params)
        .then(res => {
          if (res.Success == true) {
            this.$message({
              message: `提交成功`,
              type: "success",
              duration: 1200              
            });
            this.isshowAdd = false; 
            this.isshowEdit = false; 
            this.isshowList = true; 
            this.getList();
          } else {
            this.$message({
              message: res.Message,
              type: "warning",
              duration: 1500              
            });
          }
        })
        .catch(err => {
          this.$message.error(res.Message);
        });
    },
    validationFn(){//验证提交表格是否出错
      let myArr = []; //为了传参
      let operaPrint = this.operaPrint;
      operaPrint.forEach(value => {
        let money = value.Money; //金额
        let docNo = value.Borrow_DocNO; //编号
        let temp = `{"je":${money},"ID":"${docNo}"}`;
        myArr.push(temp);
      });
      this.hxje = myArr.join(","); //逗号分割并拼接备份给json字符串传参
      this.hxje = `[` + this.hxje + `]`;
      let params={
          key: this.DocNo, //还款单据编号
          Repay_DocStatus: 2, //2是提交
          Repay_DocDate: this.Repay_DocDate, //日期
          Repay_Title: this.Repay_Title, //描述标题
          Repay_TotalRepayMoney: this.Repay_TotalRepayMoney, //金额
          hxje: this.hxje //明细json字符串
      }      
      let That=this;
      return new Promise(function(resolve,reject){
        axios.get('erRepayVerification', params).then(res=>{
          if (res.Success == true) {
            resolve()
          } else {
            That.$message({
              message: res.Message,
              type: "warning",
              duration:1500              
            });
          }
        }).catch(err=>{
          console.log(err,"err")
        });
      })

    },    
    // editSubmit(){
    //   this.getState();
    //   if(this.communiTypes===2){ 
    //     this.isshowLauch = true;
    //     this.dialogCommunicationVisible = true;
    //   } else {
    //     this.SubmitForm();
    //   }
    // },
    editSubmit(){
      this.validationFn().then(res=>{
        this.getState();
        if(this.communiTypes===2){ 
          this.isshowLauch = true;
          this.dialogCommunicationVisible = true;
        } else {
          this.SubmitForm();
        }
      })
    },
    /**
     * 编辑-保存
     */
    editSave() {
      let myArr = []; //为了传参
      let operaPrint = this.operaPrint;
      operaPrint.forEach(value => {
        let money = value.Money; //金额
        let docNo = value.Borrow_DocNO; //编号
        let temp = `{"je":${money},"ID":"${docNo}"}`;
        myArr.push(temp);
      });
      this.hxje = myArr.join(","); //逗号分割并拼接备份给json字符串传参
      this.hxje = `[` + this.hxje + `]`;
      axios
        .post("submitRefund", {
          key: this.DocNo, //还款单据编号
          Repay_DocStatus: 1, //1是保存
          Repay_DocDate: this.Repay_DocDate, //日期
          Repay_Title: this.Repay_Title, //描述标题
          Repay_TotalRepayMoney: this.Repay_TotalRepayMoney, //金额
          hxje: this.hxje //明细json字符串
        })
        .then(res => {
          if (res.Success == true) {
            this.$message({
              message: res.Message,
              type: "success",
              duration: 1200
            });
          } else {
            this.$message({
              message: res.Message,
              type: "warning",
              duration: 1500              
            });
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    //预览
    preview(scoped) {
      console.log(this.$refs["images"]);
      if (this.viewer) {
        this.viewer.destroy();
      }
      this.viewer = new this.$Viewer(this.$refs["images"], {
        url: "src",
        toolbar: {
          zoomIn: {
            show: 4,
            size: "large"
          },
          zoomOut: {
            show: 4,
            size: "large"
          },
          prev: {
            show: 4,
            size: "large"
          },
          next: {
            show: 4,
            size: "large"
          },
          rotateLeft: {
            show: 4,
            size: "large"
          },
          rotateRight: {
            show: 4,
            size: "large"
          }
        }
      });
      console.log(this.$refs["images"].childNodes[scoped.$index])     
      this.$refs["images"].childNodes[scoped.$index].childNodes[0].click()
    },
    //打开附件列表窗口
    openUploadDialog() {
      this.dialogUploadVisible = true;
      this.getUploadList();
    },
    //附件列表
    async getUploadList() {
      const res = await axios.get('UploadList', {
        key: this.DocNo,
        type: this.DocType,
        page: 1, //一页
        rows: 5000 //显示5000条
      })
      this.UploadList = res.rows;
    },
    //删除附件
    async DeleUpload(index,row) {
      const res = await axios.get('deleUpload',{key:row.ID})
      if (res.Success) {
          this.$message({
            message: res.Message,
            type: "success"
          })
          this.getUploadList();
      }else{
          this.$message({
            message: res.Message,
            type: "error"
          })
      }
    },
    //打印
    printPdf() {
      $("#form1").jqprint({
        debug: false,
        importCSS: true,
        printContainer: false,
        operaSupport: false
      });
    },
    //判断是否显示预览按钮
    isShowPreview (name) {
      var fileType = ['gif','jpg','png','JPG','PNG'];
      var temp = name.substring(name.lastIndexOf('.')+1);
      if(fileType.indexOf(temp) > -1) {
        return true
      }else {
        return false
      }
    },
    //开始上传附件
    update(e) {
      for(var i=0 ;i < e.target.files.length;i++){
        let file = e.target.files[i];
        let param = new FormData(); //创建form对象
        param.append('fileData', file); //通过append向form对象添加数据
        param.append('chunk', '0'); //添加form表单中其他数据
        param.append('key', this.DocNo); //添加form表单中其他数据
        param.append('Type', this.DocType);
        console.log(param.get('file')); //FormData私有类对象，访问不到，可以通过get判断值是否传进去
        let config = {
          headers: {
            'Content-Type': 'multipart/form-data'
          }
        }; //添加请求头
        axios.post('Upload', param, config).then(res => {
          if(res.Success){
            this.$message({
              message: `上传成功`,
              type: 'success',
              duration: 800
            });
          }else{
            this.$message({
              message: res.Message,
              type: 'warning',
              duration: 2000
            });
          }
          this.getUploadList();
        }).catch(err => {
          console.log(err)
        })
      }
    },
  },
  mounted() {
    this.AuditAndApply(); //审核页面
    this.checkMsg(); //审核提示
    this.getList();
    if(this.$route.query.News){
      this.handleAdd();
    }
  },
  computed:{
    //核算借款
    Count(){
      let sum = 0;
      for (let i of this.operaPrint){
        sum += Number(i.Money)
      }
      return sum.toFixed(2);
    },
  }
};
</script>
<style scoped lang="scss">
@import "../../common/css/index.css";
.toolbar h2 {
  line-height: 36px;
  margin: 0 10px 0 0;
}

</style>
